let count=0;
$(function () {
    addSomething();
});

$("#load-more").click(function () {
    addSomething();
});
function test() {
    let s = "[{\"name\": \"lisi\", \"age\": \"18\"}, {\"name\": \"zhangsan\", \"age\": \"19\"}]";
    let x = eval(s);
    alert(x[0].name + " " + x[0].age);
}

function addSomething(){
    let xhr=new XMLHttpRequest();
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4 && xhr.status === 200) {
            let s=xhr.responseText;
            if(s.length===0){
                $("#load-more").text("没有更多了...");
                return;
            }
            let t = JSON.parse(s).blogs;
            let res=" " ;
            for (let i = 0; i < t.length; i++) {
                t[i].firstTitle = t[i].firstTitle.substr(0, 30);
                t[i].secondTitle = t[i].secondTitle.substr(0, 42);
                let flag1 = "";
                let flag2 = "";
                if (t[i].firstTitle.length <= 15) {
                    flag1="<br>";
                }
                if (t[i].secondTitle.length <= 21) {
                    flag2="<br>";
                }
                res += '<!-- blog -->\n' +
                    '            <div class="col-md-4">\n' +
                    '                <div class="blog">\n' +
                    '                    <div class="blog-content">\n' +
                    '                        <ul class="blog-meta">\n' +
                    '                            <a href="../team/person_page.jsp?userId='+ t[i].authorId+'"><li><i class="fa fa-user"></i>' + t[i].author + '</li></a>\n' +
                    '                            <li><i class="fa fa-clock-o"></i>' + t[i].date + '</li>\n' +
                    '                            <li><i class="fa fa-comments"></i>' + t[i].id + '</li>\n' +
                    '                        </ul>\n' +
                    '                        <a href="./blog-single.jsp?id=' + t[i].id + '"><h3 style="word-break: break-all">' + t[i].firstTitle + '</h3>'+flag1 +'\n' +
                    '                        <p style="word-break: break-all;color: black">' + t[i].secondTitle + '</p>\n'+ flag2+' ' +
                    '                        Read more</a>\n' +
                    '                    </div>\n' +
                    '                </div>\n' +
                    '            </div>\n' +
                    '            <!-- /blog -->';
            }
            $("#row").append(res);
        }

    };
    xhr.open("GET", "./blogGrid?n="+count);
    xhr.send();
    count++;
}



